<template>
  <page class="applyadmin">
    <page-header>
      <x-header :left-options="{backText: ''}">申请单管理</x-header>
    </page-header>
    <page-content class="inner" :scroll="true" @refresh="refresh" @infinite="infinite">
      <loading v-if="empty" :loading="loading" :empty="empty"></loading>
      <div v-else>
        <card class="warning device-item" v-for="item in list" :key="item.id" @click.native="handleCardClick(item.id)">
          <card-header>
            <span slot="title">{{item.actApply.applyNumber}}</span>
            <span slot="text">{{item.apiTaskName}}</span>
          </card-header>
          <card-content>
            <div class="grid">
              <div class="grid-item h-full">
                <label class="label">申请单位</label>
                <span class="vlaue">{{item.actApply.linkName}}</span>
              </div>
              <div class="grid-item h-full">
                <label class="label">申请人</label>
                <span class="vlaue">{{item.actApply.linkName}}</span>
              </div>
              <div class="grid-item h-full">
                <label class="label">工程项目</label>
                <span class="vlaue">{{item.actApply.warehouse.name}}</span>
              </div>
              <div class="grid-item h-full">
                <label class="label">要求到货时间</label>
                <span class="vlaue">{{item.actApply.arriveTime || format('YYYY-MM-DD')}}</span>
              </div>
            </div>
          </card-content>
        </card>
      </div>
    </page-content>
  </page>
</template>

<script>
import { mapGetters } from 'vuex'
import { XHeader } from 'vux'
import { actAllot } from '@service'

export default {
  name: 'ActApplyFinishList',
  components: {
    XHeader
  },
  computed: {
    ...mapGetters({
      userInfo: 'user/info',
      token: 'user/token'
    }),
    userId () {
      return this.userInfo.id
    },
    empty () {
      return this.list.length === 0
    }
  },
  data () {
    return {
      page: {
        count: '',
        pageNo: 1,
        pageSize: 10
      },
      list: [],
      loading: false
    }
  },
  methods: {
    async refresh () {
      await this.loadData()
    },
    // 上拉加载更多
    async infinite () {
      await this.loadData()
    },
    async loadData () {
      try {
        let userId = this.userId
        let token = this.token
        let page = this.page
        this.loading = true
        let data = await actAllot.list({ token, userId, ...page })
        this.list = data
        this.loading = false
        return data
      } catch (error) {
        console.log(error)
        this.loading = false
      }
    },
    handleCardClick (id) {
      this.$router.push('apply/' + id)
    }
  },
  created () {
    this.loadData()
  }
}
</script>

<style lang="scss">
.applyadmin {
}
</style>
